/**
 * 个人评分
 */
import React, { useState } from 'react';
import request from '@/http';
import {
  Table,
  Radio,
  Space,
  Input,
  DatePicker,
  Select,
  Button,
  Divider,
  Form,
} from 'antd';
const { Option } = Select;
import style from './Personal.less';
import { Link } from 'react-router-dom';
import { history } from '@/.umi/core/history';
import All_style from '../../index.less';

const columns = [
  {
    title: '院系',
    dataIndex: 'college_name',
    key: 'college_name',
  },
  {
    title: '项目名称',
    dataIndex: 'course_name',
    key: 'course_name',
  },
  {
    title: '责任老师',
    dataIndex: 'teacher_name',
    key: 'teacher_name',
  },
  {
    title: '小组',
    dataIndex: 'team_name',
    key: 'team_name',
  },
  {
    title: '学生姓名',
    dataIndex: 'student_name',
    key: 'student_name',
  },
  {
    title: '性别',
    dataIndex: 'student_sex',
    key: 'student_sex',
    render: (text, row) => {
      return row.sex === 1 ? '男' : '女';
    },
  },
  {
    title: '学号',
    dataIndex: 'student_id',
    key: 'student_id',
  },
  {
    title: '项目角色',
    dataIndex: 'ts_role',
    key: 'ts_role',
  },
  {
    title: '专业',
    dataIndex: 'major_name',
    key: 'major_name',
  },
  {
    title: '操作',
    // dataIndex: 'operation_matter',
    key: 'operation_matter',
    render: (row) => (
      <>
        <Link
          to={{
            pathname: '/Teacher/Comprehensive/edit',
            state: { courseId: row.courseId, studentId: row.student_id },
          }}
        >
          <Button type="link">详情</Button>
        </Link>
      </>
    ),
  },
];
const Personal = (prop: any) => {
  // 项目名称绑定接口
  const [courseName, setCourseName] = React.useState([]);
  const CourseName = async () => {
    const CourseName: any = await request.get(
      '/homeWork_manager_module/a_t_s/queryCourse',
    );
    setCourseName(CourseName.data);
  };
  // 小组名称绑定接口
  const [teamName, setTeamName] = React.useState([]);
  const getTeamName = async () => {
    const teamName: any = await request.get(
      '/homeWork_manager_module/a_t_s/queryGroup',
    );
    setTeamName(teamName.data);
  };

  /**
   * 个人评分表绑定接口
   */
  interface pay {
    current: number;
    pageSize: number;
    total: number;
    onChange: any;
  }
  const onCurrentChange = (page, pageSize) => {
    getData(page, pageInfo.pageSize);
  };
  const [pageInfo, setPageInfo] = useState<pay>({
    current: 1,
    pageSize: 4,
    total: 0,
    onChange: onCurrentChange,
  });
  const [data, setData] = React.useState();
  const getData = async (current, pageSize) => {
    const selectForm = await formObject.validateFields(); //获得表单数据
    const result: any = await request.post(
      '/scoring/a_t/QueryPersonalScoreCondition',
      {
        page: current,
        number: pageSize,
        courseId: selectForm.project_name,
        teamId: selectForm.group_name,
      },
    );
    // if (result.success) {
    const newData = result.data.returnDate.map((d) => {
      return {
        id: d.id,
        key: `key_{d.id}`,
        college_name: d.collegeName,
        student_name: d.studentName,
        major_name: d.majorName,
        course_name: d.courseName,
        teacher_name: d.responsibilityName,
        team_name: d.teamName,
        student_id: d.studentId,
        grouper: d.grouper,
        wc_score: d.score,
        ts_role: d.role,
        student_sex: d.sex,
        courseId: d.courseId,
      };
    });
    setPageInfo({
      current: result?.data?.paginationData?.currentPage,
      pageSize: result?.data?.paginationData?.number,
      total: result?.data?.paginationData?.sum,
      onChange: pageInfo.onChange,
    });
    setData(newData);

    // }
  };
  // 重置按钮
  const [formObject] = Form.useForm();
  const onReset = () => {
    formObject.resetFields();
    // console.log('重置成功');
  };

  React.useEffect(() => {
    getData(pageInfo.current, pageInfo.pageSize);
    CourseName();
    getTeamName();
  }, []);

  return (
    <div className={All_style.box}>
      <Form form={formObject} preserve={false}>
        <div>
          <Form.Item
            label="项目名称："
            name="project_name"
            style={{ float: 'left' }}
            className={All_style.formItem}
          >
            <Select
              // mode="multiple"
              allowClear
              placeholder="请选择"
              className={All_style.select}
              optionFilterProp="children"
              showSearch
            >
              {courseName.map((c: any) => {
                return (
                  <Option key={c.courseId} value={c.courseId}>
                    {c.courseName}
                  </Option>
                );
              })}
            </Select>
          </Form.Item>
          <Form.Item
            label="小组名称："
            name="group_name"
            style={{ float: 'left' }}
            className={All_style.formItem}
          >
            <Select
              // mode="multiple"
              allowClear
              placeholder="请选择"
              className={All_style.select}
              optionFilterProp="children"
              showSearch
            >
              {teamName.map((c: any) => {
                return (
                  <Option key={c.teamId} value={c.teamId}>
                    {c.teamName}
                  </Option>
                );
              })}
            </Select>
          </Form.Item>
          <Button
            className={All_style.button}
            onClick={() => getData(pageInfo.current, pageInfo.pageSize)}
          >
            查询
          </Button>
          <Button
            htmlType="button"
            onClick={onReset}
            className={All_style.button2}
          >
            重置
          </Button>
        </div>
      </Form>
      <Table
        pagination={pageInfo}
        columns={columns}
        dataSource={data}
        className={All_style.table}
      />
    </div>
  );
};
export default Personal;
